<template>
	<div>
		<el-scrollbar :height="isTagsview ? `calc(100vh - 154px)` : `calc(100vh - 120px)`">
			<div>
				<zh-space>
					<zh-card title="">
						<zh-form ref="userQueryFrom" :model="state.queryParam">
							<zh-form-input prop="userName" label="用户名" placeholder="支持模糊查询" v-model="state.queryParam.userName"></zh-form-input>
							<zh-form-input prop="fullName" label="姓名" placeholder="支持模糊查询" v-model="state.queryParam.fullName"></zh-form-input>
							<zh-form-query :disabled="props.disabled" :formRef="userQueryFrom" :tableRef="userListTable" :showAdvanced="false"> </zh-form-query>
						</zh-form>
					</zh-card>

					<zh-table ref="userListTable" :rowConfig="{keyField:'userId'}" title="用户列表" :funcCode="state.funcCode" :columns="state.tableColumn">
						<template #status_default="{ row }"><zh-badge :status="statusMap[row.status].status" :text="statusMap[row.status].text" /></template>
					</zh-table>
				</zh-space>
			</div>
		</el-scrollbar>
		<zh-dialog :title="title" width="85%" :fullscreen="true" v-model="state.addUservisible" @confirm="saveUser">
			<add-user-module v-if="type === 'org'" ref="userPage" :id="id" :type="type" />
			<add-router-user-module v-if="type === 'router'" ref="userPage" :id="id" />
			<AddAppMenuUserModule v-if="type === 'menu'" ref ="userPage" :id="id"/>
		</zh-dialog>
	</div>
</template>

<script lang="ts" setup name="UserModule">
import type { FormInstance } from 'element-plus';
import AddUserModule from '@/views/system/component/AddUserModule.vue';
import AddRouterUserModule from '@/views/system/config/router/component/AddRouterUserModule.vue';
import AddAppMenuUserModule from '@/views/system/config/appMenu/component/AddAppMenuUserModule.vue';

const { isTagsview } = storeToRefs($store.theme);
//------------------接收传入参数------------------------
const props = defineProps({
	id: {
		type: String,
	},
	type: {
		type: String,
	},
	title: {
		type: String,
		default: '单独添加用户',
	},
	disabled:{
		type: Boolean,
		default: false,
	},
});
//-------------------获取接口-------------------------------
//-------------------组件ref定义-----------------------------
const userQueryFrom = ref<FormInstance>();
const userListTable = ref<any>({});
const userPage = ref<any>({});
//-------------------内部变量定义---------------------------
const state = reactive({
	queryParam: { userName: '', fullName: '', routerId: '', orgId: '',searchType:'2',menuId:'' },
	funcCode: '',
	tableColumn: [
		{ type: 'checkbox', width: 50, fixed: 'left' },
		{ type: 'seq', width: 50, fixed: 'left', align: 'center', title: '序号' },
		{ field: 'userId', title: '用户Id', visible: false, fixed: 'left', align: 'center', minWidth: 150 },
		{ field: 'userName', title: '用户名', align: 'center', minWidth: 150 },
		{ field: 'fullName', title: '姓名', align: 'center', minWidth: 150 },
		{ field: 'privilegeSource', title: '授权来源ID', visible: false, align: 'center', width: 150 },
		{ field: 'sourceName', title: '授权来源', align: 'center', minWidth: 150 },
		{ field: 'userType', title: '用户类型key', visible: false, align: 'center', width: 150 },
		{ field: 'userTypeName', title: '用户类型', align: 'center', minWidth: 150 },
		{
			field: 'status',
			title: '状态',
			align: 'center',
			minWidth: 80,
			slots: {
				default: 'status_default',
			},
		},
	],
	addUservisible: false,
	name: '',
});
//------------------------------内部变量定义-----------------------------------------------
const statusMap = {
	0: {
		status: 'error',
		text: '禁用',
	},
	1: {
		status: 'processing',
		text: '启用',
	},
};
//--------------------------------------定义调用方法-----------------------------------------
//用户列表查询
const onUserQuery = () => {
	console.log(props.disabled)
	if(props.disabled){
		return;
	}else{
		userListTable.value.query(state.queryParam);
	}
	
};
//打开添加用户页面
function openAddUserModule() {
	if (props.id) {
		state.addUservisible = true;
	} else {
		$messageBox.warning('请先选择需要操作的' + state.name, '提示');
	}
}
//添加用户
function saveUser() {
	const userIds = userPage.value.getCheckedUserIds();

	const params: any = {};
	params.userIds = userIds;
	let funcCode = '';
	if (props.type === 'org') {
		if (!props.id) {
			$messageBox.warning('请先传入需要授权的组织', '提示');
			return false;
		}
		params.orgId = props.id;
		funcCode = 'org0016';
	} else if (props.type === 'router') {
		if (!props.id) {
			$messageBox.warning('请先传入需要授权的路由', '提示');
			return false;
		}
		funcCode = 'router0019';
		params.routerId = props.id;
		const sysIds = userPage.value.getSysIds();
		params.sysIds = sysIds;
	}else if(props.type === 'menu'){
		if(!props.id){
			$messageBox.warning('请先传入需要授权的手机路由', '提示');
			return false;
		}
		funcCode = 'appmenu0018';
		params.menuId = props.id;
		const sysIds = userPage.value.getSysIds();
		params.sysIds = sysIds;
	} else {
		$messageBox.error('类型未定义', '提示');
		return false;
	}

	setTimeout(() => {
		$api.common.send
			.post(funcCode, params)
			.then(() => {
				$messageBox.success('授权成功', '成功提示');
				state.addUservisible = false;
				onUserQuery();
			})
			.catch(() => {});
	}, 10);
}
//删除用户
const deleteUser = () => {
	//获取勾选数据
	const checkedList = userListTable.value.getAllCheckboxRecords();
	if (props.id) {
		if (checkedList && checkedList.length > 0) {
			let userIds: any = [];
			checkedList.forEach((item: any) => {
				userIds.push(item.userId);
			});
			if (props.type === 'router') {
				const params = { routerId: props.id, userIds: userIds };
				$api.common.send.post('router0020',params).then(() => {
					$messageBox.success('删除成功', '提示');
					onUserQuery();
				});
			}else if(props.type === 'menu'){
				const params = { menuId: props.id, userIds: userIds };
				$api.common.send.post('appmenu0019',params).then(() => {
					$messageBox.success('删除成功', '提示');
					onUserQuery();
				});
			} else {
				const params = {
					userIds: userIds,
					orgId: props.id,
				};
				$api.common.send.post('org0017', params)
					.then(() => {
						$messageBox.success('删除成功', '成功提示');
						onUserQuery();
					})
					.catch(() => {});
			}
		} else {
			$messageBox.warning('请先勾选需要删除的用户', '提示');
		}
	} else {
		$messageBox.warning('请先选择某一节点再操作', '提示');
	}
};
//-------------------设置给父组件调用的方法------------------
defineExpose({
	onUserQuery,
	deleteUser,
	openAddUserModule,
	saveUser,
});
//--------------------页面初始化---------------------------------
onMounted(() => {
  if (props.type === 'router') {
    state.funcCode = 'router0013';
    state.name = '路由';
  }
  if (props.type === 'org') {
    state.funcCode = 'org0028';
    state.name = '组织';
  }
	if (props.type === 'menu') {
		state.funcCode = 'appmenu0023';
		state.name = '手机路由';
	}
	if (props.id) {
		state.queryParam[props.type + 'Id'] = props.id;
	}
});

//--------------------监听变动数据-----------------------------
watch(
	() => props.id,
	(id) => {
		if (id) {
			state.queryParam[props.type + 'Id'] = id;
			onUserQuery();
		} else {
			//清空表格
			userListTable.value.setData([]);
		}
	}
);
</script>
<style lang="scss" scoped></style>
